<template>
	<view>
		<view class="cu-modal top-modal" :class="isShow?'show':''">
			<view class="cu-dialog">
				<view class="cu-bar bg-white justify-end">
					<view class="content" style="font-size: 32rpx;
					width: 100%;height: auto;padding-top: 45rpx;">{{title}}</view>
					<view class="action" @tap="close">
						<text class="cuIcon-close text-red"></text>
					</view>
				</view>
				<view class="padding-xl text-xs bg-white">
					<view v-if="type == 'nickname'">
						<input type="nickname" :value="nicknameData.nickname" @blur="nicknameBlur" maxlength="10" placeholder="请输入昵称" class="solids bg-gray text-left padding-left-sm padding-right-sm"
						style="height: 80rpx;"/>
					</view>
					<view v-else>
						{{content}}
						<slot name="content"></slot>
					</view>
				</view>
				<view class="cu-bar bg-white" v-if="isFoot">
					<button v-if="isCancel" class="cu-btn text-black bg-white flex-sub" 
					style="width: 100%;height: 100rpx;font-size: 35rpx;"
					@tap="isShow = false">{{cancelText}}</button>
					<button class="cu-btn bg-white text-blue flex-sub" 
					style="width: 100%;height: 100rpx;font-size: 35rpx;"
					@tap="confirmClick">{{confirmText}}</button>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name:"yw-modal",
		data() {
			return {
				isShow:false,
				isCancel:false,
				isFoot:true,
				title:"",
				content:"",
				cancelText:"",
				confirmText:"",
				confirmEvent:null,
				type:"",
				nicknameData:{
					nickname:""
				}
			};
		},
		methods:{
			open(options,confirmEvent){
				if(uni.$common.isNull(options)){
					options = {}
				}
				if(uni.$common.isNotBlank(options.title)){
					this.title = options.title
				}else{
					this.title = `提示`
				}
				if(uni.$common.isNotBlank(options.content)){
					this.content = options.content
				}else{
					this.content = ""
				}
				if(uni.$common.isNotBlank(options.confirmText)){
					this.confirmText = options.confirmText
				}else{
					this.confirmText = `确认`
				}
				if(uni.$common.isNotBlank(options.cancelText)){
					this.cancelText = options.cancelText
				}else{
					this.cancelText = `取消`
				}
				if(uni.$common.isNotBlank(options.isCancel)){
					this.isCancel = options.isCancel
				}else{
					this.isCancel = false
				}
				if(uni.$common.isNotNull(options.isFoot)){
					this.isFoot = options.isFoot
				}else{
					this.isFoot = true
				}
				if(uni.$common.isNotBlank(options.type)){
					this.type = options.type
					if(options.type == 'nickname'){
						this.nicknameData.nickname = ""
						this.isCancel = true
					}
				}else{
					this.type = ``
				}
				if(uni.$common.isNull(confirmEvent)){
					this.confirmEvent = null
				}else{
					this.confirmEvent = confirmEvent
				}
				
				this.isShow = true
			},
			close(){
				this.isShow = false
			},
			nicknameBlur(e){
				console.info("nicknameBlur",e)
				this.nicknameData.nickname = e.detail.value
			},
			confirmClick(){
				if(this.type == "nickname"){
					if(uni.$common.isBlank(this.nicknameData.nickname)){
						uni.$common.modalInfo("请输入昵称")
					}else{
						uni.$user.updateInfo("nickName",this.nicknameData.nickname,()=>{
							if(uni.$common.isNotNull(this.confirmEvent)){
								this.isShow = false
								this.confirmEvent(this.nicknameData.nickname,)
							}
						})
					}
				}else{
					this.isShow = false
					if(uni.$common.isNotNull(this.confirmEvent)){
						setTimeout(()=>{
							this.confirmEvent()
						},300)
					}
				}
				
			}
		}
	}
</script>

<style>

</style>
